async function sendRequest() {
    let response = "";
    await axios
        .get("https://ncovdata.market.alicloudapi.com/ncov/cityDiseaseInfoWithTrend", {
            headers: {
                "Access-Control-Allow-Headers": "*",
                "Authorization": "APPCODE a1b941449cb041f688b85824f2a7f5e7",
            },
        })
        .then((resp) => {
            response = resp.data;
        })
        .catch((err) => {
            console.log(err);
        });
    return response;
}

var app = Vue.createApp({});
sendRequest().then((res) => {
    app = Vue.createApp({
        data() {
            return {
                allData: res,
                // *更新时间
                // *数据源
                // *全国共计确诊
                // *全国共计已故
                // *全国共计治愈
                // *各省份数据

                UT: res.dataSourceUpdateTime ? res.dataSourceUpdateTime.updateTime : "",
                DS: res.dataSourceUpdateTime ? res.dataSourceUpdateTime.dataSource : "",
                TCF: res.country ? res.country.totalConfirmed : "",
                TD: res.country ? res.country.totalDeath : "",
                TC: res.country ? res.country.totalCured : "",
                PD: res.provinceArray ? res.provinceArray : "",
                // provinceArray.item---------------
                // {
                //  totalCured
                //  totalDeath
                //  totalIncrease
                //  cityArray
                //  childStatistic
                // }
                now: -1,
                provinces: [],
                selectedProvince: -1,
                cities: [],
                length: -1,
            };
        },

        watch: {
            selectedProvince(newValue) {
                this.now = 0;
                if (newValue == -1) {
                    this.cities.length =0;
                    this.length = -1;
                    this.now = -1;
                }
                else {
                    this.cities = res.provinceArray[this.selectedProvince].cityArray;

                    this.length = this.cities.length;

                    
                }
            }
        },

        methods: {
            lastPage() {
                if (this.selectedProvince != -1) {
                    if (this.now > 0) {
                        this.now--;
                    }
                }
            },
            nextPage() {
                if (this.selectedProvince != -1) {
                    if (this.now < this.maxPage - 1) {
                        this.now++;
                    }
                }
            },

            getArea(index) {
                index = this.now * 10 + index - 1;
                return this.length != -1 ? this.cities[index].childStatistic : ""
            },
            getTCF(index) {
                index = this.now * 10 + index - 1;
                return this.cities ? this.cities[index].totalConfirmed : "";
            },
            getTD(index) {
                index = this.now * 10 + index - 1;

                return this.cities ? this.cities[index].totalDeath : ""
            },
            getTC(index) {
                index = this.now * 10 + index - 1;
                return this.cities ? this.cities[index].totalCured : "";
            },
            getTI(index) {
                index = this.now * 10 + index - 1;
                return this.cities.length != 0 ? this.cities[index].totalIncrease : "";
            }


        },
        created() {
            this.provinces = res.provinceArray.map((value, index) => {
                return {
                    "index": index,
                    "provinceName": value.childStatistic,
                }
            });
            this.provinces.push({ "index": -1, "provinceName": "-----" });
            this.provinces.sort((a, b) => {
                a = a.index;
                b = b.index;
                return a - b;
            })

        },
        computed: {
            maxPage() {
                let page = 0;
                if (this.length < 10) {
                    page = (this.cities.length===0)?0:1;
                }
                else {
                    if (this.length % 10 == 0) {
                        page = parseInt(this.length / 10) 
                    }
                    else {
                        page =parseInt(this.length / 10)+1;
                    }
                }
                return page;
            }
        }
    }).mount("#bpp");
});